<template>
  <div class="home">
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
      <Swiper :banner-list="bannerList" />

      <Header />

      <Diamond :diamond-list="diamondList" />
      <Goods
        v-model="isLoading"
        title-name="为你推荐"
        :goods-list="goodsList"
        :is-finished="isFinished"
        @onReachBottom="onReachBottom"
      />
    </van-pull-refresh>
    
    <!-- <Session :session-list="sessionList" /> -->
    <!-- <Goods
      v-model="isLoading"
      title-name="HOT"
      :goods-list="goodsList"
      :is-finished="isFinished"
      @onReachBottom="onReachBottom"
    />
    <Goods
      v-model="isLoading"
      title-name="NEW"
      :goods-list="goodsList"
      :is-finished="isFinished"
      @onReachBottom="onReachBottom"
    /> -->
    
    <back-top />
    <!-- <div class="choujiang" @click="handleChoujiang">去抽奖</div>
    <div class="boxes" v-show="showChoujiang">
      <Lottory  />

    </div> -->
    <Skeleton v-if="isSkeletonShow" />
  </div>
</template>

<script>
import { getHomeData, getRecommonGoodsList } from '@/api/home'
import { getUserSign,getInfo } from '@/api/user'
import { getToken } from '@/utils/auth'
import Header from './modules/Header'
import Swiper from './modules/Swiper'
import Goods from './modules/Goods'
// import Goods from './modules/GoodsVantCard'
import GoodsLimit from './modules/GoodsLimit'
import Diamond from './modules/Diamond'
import Lottory from '@/components/Lottery/Lottory.vue'
// import Session from './modules/Session'
import Skeleton from './modules/Skeleton'
import { mapGetters } from 'vuex'

export default {
  name: 'Home',
  computed: {
    // ...mapGetters(['userInfo'])
  },
  components: {
    Header,
    Swiper,
    Diamond,
    // Session,
    Goods,
    GoodsLimit,
    Skeleton,
    Lottory
  },
  data() {
    return {
      mallConfig: {},
      bannerList: [],
      diamondList: [],
      sessionList: [],
      newGoodsList: [],
      hotGoodsList: [],
      goodsList: [],
      pageSize: 6,
      pageNum: 1,
      isLoading: false,
      isFinished: false,
      isSkeletonShow: true,
      userInfo:{},
      showChoujiang:false
    }
  },
  async created() {
    this.$toast.loading({message:'加载中...',duration:500})
    const needRefresh = sessionStorage.getItem('needRefresh')

    await this.getHomeIndexData()
    if(needRefresh){
      await this.getRecommonGoodsList()
      sessionStorage.removeItem('needRefresh')
    }
  },
  async activated(){
    await this.getRecommonGoodsList()
    this.$toast.clear()
  },
  methods: {
    async onRefresh(){
      this.isLoading=true
      this.pageNum ++ 
      await this.getRecommonGoodsList('refresh')
    },
    async getHomeIndexData() {

      console.log(process.env)
      const res = await getHomeData()
        const { map } = res
        map.diamondList.forEach(item=>{
          item.picUrl = item.picUrl+"?imageView2/1/w/600/h/600&v=0.0.1"
          item.iconUrl = item.iconUrl+"?imageView2/1/w/600/h/600&v=0.0.1"
        })
        map.bannerList.forEach(item=>{
          item.imgUrl = item.imgUrl+"?imageView2/1/w/750/h/380&v=0.0.1"
        })
        console.log(res)
        this.bannerList = map.bannerList
        this.diamondList = map.diamondList
        this.sessionList = [
          {
            '_id': '5f5b1ec83f8b304102b77e8d',
            'img': 'https://m.360buyimg.com/babel/s750x300_jfs/t1/96501/1/14812/180805/5e69f6e2E65623863/c40c27c4ec520eef.jpg',
            'title': '头号爆品、新书特卖专场',
            'tagnum': 1000,
            'discount': 3,
            'time': 1699807149739
          },
          {
            '_id': '5f5b1ec83f8b304102b77e90',
            'img': 'https://m.360buyimg.com/babel/s1125x450_jfs/t1/98771/1/15620/172104/5e733babEe579fad9/d7d5e51a1f2975e8.jpg',
            'title': '321阅读日、热门专场',
            'tagnum': 9999,
            'discount': 8,
            'time': 1699907149739
          },
          {
            '_id': '5f5b1ec83f8b304102b77e93',
            'img': 'https://m.360buyimg.com/babel/s1125x450_jfs/t1/85360/22/15634/120107/5e733524E4883f099/c8c92ebd6112a76e.jpg',
            'title': '电影学院，电影书籍专场特卖',
            'tagnum': 666,
            'discount': 5,
            'time': 2699907149739
          }
        ]
        // map.newGoodsList.forEach(item=>{
        //   item.imgUrl = item.imgUrl+"?imageView2/1/w/375/h/150"
        // })
        // map.hotGoodsList.forEach(item=>{
        //   item.imgUrl = item.imgUrl+"?imageView2/1/w/375/h/150"
        // })
        this.newGoodsList = map.newGoodsList
        this.hotGoodsList = map.hotGoodsList
        this.isSkeletonShow = false
      
    },
    async getRecommonGoodsList(type) {
      debugger
      if(getToken()){
        if(Object.keys(this.userInfo).length==0){
          const res = await getInfo()
          this.userInfo = res.map?.info
          this.$set(this,'userInfo',res.map?.info)
        }
      }
      const { map: { data }} = await getRecommonGoodsList({
        pageSize: this.pageSize,
        pageNum: this.pageNum
      })
      // alert(JSON.stringify(data))
      if (data.length < this.pageSize && this.goodsList.length >= 0) {
          this.isFinished = true
          if(type == 'refresh' ){
            this.pageNum = 1
            this.getRecommonGoodsList('refresh')
            this.isLoading = false
          }
        }

        data.forEach(element => {
          element.picUrl = element.picUrl+'?imageView2/1/w/600/h/600&v=0.0.1'
          if (element.priceType == 1) {
            if (this.userInfo.userLevel === 0) {
              element.nowPrice = element.generalPrice
            } else if (this.userInfo.userLevel === 1) {
              element.nowPrice = element.goldPrice 
            } else if (this.userInfo.userLevel === 2) {
              element.nowPrice = element.boardPrice
            } else if (this.userInfo.userLevel === 3) {
              element.nowPrice = element.ceoPrice 
            }else{
              element.nowPrice = element.generalPrice
            }
          } else if (element.priceType == 2) {
            element.nowPrice = element.pointPrice + '积分'
          } else {
            element.nowPrice = element.retailPrice
          }

          // console.log(element)
        })
        this.isLoading = false
        // console.log('data[0].nowPrice',data[0].nowPrice)
        if(type == 'refresh' ){
          this.goodsList = [ ...data]
        }else{
          this.goodsList = [...this.goodsList, ...data]
        }
        
        
    },
    // reach-bottom
    onReachBottom() {
      this.pageNum += 1
      this.getRecommonGoodsList()
    },
    handleChoujiang(){
      this.showChoujiang = true
    }
  }
}
</script>

<style lang="scss" scoped>
.home {
  background: #f5f5f5;
  min-height: 100vh;
  .logo {
    display: block;
    width: 200px;
    margin: 0 auto;
    padding-top: 40px;
  }
  .menu__right {
    width: 50px;
  }
}
.choujiang{
  position: fixed;
  right: 50px;
  bottom: 300px;
  width: 100px;
  height: 100px;
  line-height: 100px;
  border-radius: 50%;
  background-color: #00000050;
  color: #fff;
}
.boxes{
  width: 100vw;
  height: 100vh;
  background-color: #7e7d7d10;
  // opacity: 0.1;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
